<template>
  <div class="about">
    <van-row v-for="item in shopcar" :key="item._id">
      <van-col span="4">
        <van-checkbox v-model="item.status" @click="checkItem"></van-checkbox>

        <!-- 在用复选框的时候 原生 用change事件 vant 用click事件 -->
      </van-col>
      <van-col span="20">
        <van-card
          :price="item.price"
          :title="item.title"
          :thumb="item.pic"
          :num="item.num"
        >
          <template #footer> </template>
        </van-card>
      </van-col>
    </van-row>

    <van-submit-bar :price="3050" button-text="提交订单">
      <van-checkbox v-model="$store.state.checked" @click="checkAll">全选</van-checkbox>
    </van-submit-bar>
  </div>
</template>
<script>
export default {
  computed: {
    shopcar() {
      return this.$store.state.shopcar;
    },
  },
  methods: {
    checkItem() {
      this.$store.commit("checkItem");
    },
    checkAll(){
       this.$store.commit("checkAll");
    }
  },
};
</script>
